<%--
  Created by IntelliJ IDEA.
  User: Ren
  Date: 2022/10/21
  Time: 16:38
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>当前用户个人信息</title>
    <!--引入elementui得样式-->
    <link type="text/css" rel="stylesheet" href="/css/index.css"/>
    <!--引入vue得依赖必须再elementui之前引入vue-->
    <script type="text/javascript" src="/js/vue.js"></script>
    <script type="text/javascript" src="/js/index.js"></script>
    <script type="text/javascript" src="/js/axios.min.js"></script>
    <script type="text/javascript" src="/js/qs.min.js"></script>
</head>
<body>
<div id="app">

<template :data="flag" v-if="flag">
    <el-descriptions class="margin-top" title="当前用户信息" :column="3" :size="size" border
    :data="userVo"
        >
        <template slot="extra">
            <el-button type="primary" size="small" @click="update()">修改个人信息</el-button>
        </template>

        <el-descriptions-item :data="userheadurl">
            <template slot="label">
                <i class="el-icon-picture-outline-round"></i>
            头像
            </template>
            <img :src="userheadurl" width="50px" height="50px"/>
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-user"></i>
                用户名
            </template>
            {{userVo.realname}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-mobile-phone"></i>
                手机号
            </template>
            {{userVo.username}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-view"></i>
                密码
            </template>
            {{userVo.password}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-watch"></i>
                年龄
            </template>
            {{userVo.age}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-male"></i>
                性别
            </template>
            {{userVo.sex}}
        </el-descriptions-item>



        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-tickets"></i>
                备注
            </template>
            <el-tag size="small">普通用户(患者)</el-tag>
        </el-descriptions-item>
    </el-descriptions>
</template>


<template :data="flag1" v-if="flag1">
    <el-descriptions class="margin-top" title="当前用户信息" :column="3" :size="size" border
    :data="doctorVo"
        >
        <template slot="extra">
            <el-button type="primary" size="small" @click="update1()">修改个人信息</el-button>
        </template>

        <el-descriptions-item :data="doctorheadurl">
            <template slot="label">
                <i class="el-icon-picture-outline-round"></i>
            头像
            </template>
            <img :src="doctorheadurl" width="50px" height="50px"/>
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-user"></i>
                用户名
            </template>
            {{doctorVo.dName}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-mobile-phone"></i>
                手机号
            </template>
            {{doctorVo.dTelphone}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-view"></i>
                密码
            </template>
            {{doctorVo.dPassword}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-watch"></i>
                年龄
            </template>
            {{doctorVo.dAge}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-male"></i>
                性别
            </template>
            {{doctorVo.sex}}
        </el-descriptions-item>


        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-bank-card"></i>
                身份证号
            </template>
            {{doctorVo.dIdcard}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-school"></i>
               学历
            </template>
            {{doctorVo.dEducation}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-house"></i>
                主治方向
            </template>
            {{doctorVo.dMajor}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-tickets"></i>
                主治方向描述
            </template>
            {{doctorVo.dMajorDesc}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-trophy"></i>
                成就
            </template>
            {{doctorVo.dAchievement}}
        </el-descriptions-item>


        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-magic-stick"></i>
                状态
            </template>
            <el-tag  type="danger" v-if="doctorVo.dStatus == 0">离职</el-tag>
            <el-tag  type="success" v-else-if="doctorVo.dStatus !== 0">在职</el-tag>


        </el-descriptions-item>


        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-suitcase"></i>
                所属科室
            </template>
            {{doctorVo.tName}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-suitcase-1"></i>
                所属部门
            </template>
            {{doctorVo.deptName}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-tickets"></i>
                备注
            </template>
            <el-tag type="success"  >本医院医生(所有职员)</el-tag>
        </el-descriptions-item>
    </el-descriptions>
</template>


<template :data="flag2" v-if="flag2">
    <el-descriptions class="margin-top" title="当前用户信息" :column="3" :size="size" border
    :data="adminVo"
        >
        <template slot="extra">
            <el-button type="primary" size="small" @click="daochu()">导出个人信息</el-button>
            <el-button type="primary" size="small" @click="update2()">修改个人信息</el-button>

        </template>

        <el-descriptions-item :data="adminheadurl">
            <template slot="label">
                <i class="el-icon-picture-outline-round"></i>
            头像
            </template>
            <img :src="adminheadurl" width="50px" height="50px"/>
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-user"></i>
                用户名
            </template>
            {{adminVo.aName}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-view"></i>
                密码
            </template>
            {{adminVo.aPassword}}
        </el-descriptions-item>

        <el-descriptions-item>
            <template slot="label">
                <i class="el-icon-tickets"></i>
                备注
            </template>
            <el-tag type="danger" >超级管理员</el-tag>
        </el-descriptions-item>
    </el-descriptions>
</template>





    <!--修改的弹出层dialogVisible:控制对话框的显示和隐藏-->
    <el-dialog
            title="修改提示"
            :visible.sync="dialogVisible2"
            width="30%"
    >
        <!--:model:绑定表单数据-->
        <el-form label-width="80px" :model="editForm2">


            <el-upload
                    style="border:1px solid #bcbec2; width: 100px;height: 100px;margin-left: 94px;margin-bottom: 20px;"
                    class="avatar-uploader"
                    action="/upload/up"
                    :show-file-list="false"
                    :on-success="handleAvatarSuccess"
                    :before-upload="beforeAvatarUpload">
                <img v-if="imageUrl2" :src="imageUrl2" class="avatar" width="100px" height="100px">
                <i v-else class="el-icon-plus avatar-uploader-icon" style="margin-left: 38px;margin-top: 41px;"></i>
            </el-upload>


            <el-form-item label="账号名字" prop="aName">
                <el-input v-model="editForm2.aName"></el-input>
            </el-form-item>


            <el-form-item label="密码" prop="aPassword">
                <el-input v-model="editForm2.aPassword"></el-input>
            </el-form-item>


        </el-form>

        <span slot="footer" class="dialog-footer">
                        <el-button @click="dialogVisible2 = false">取 消</el-button>
                        <el-button type="primary" @click="confirmUpdate2">确认修改</el-button>
        </span>
    </el-dialog>



















    <!--修改的弹出层dialogVisible:控制对话框的显示和隐藏-->
    <el-dialog
            title="修改提示"
            :visible.sync="dialogVisible"
            width="30%"
    >
        <!--:model:绑定表单数据-->
        <el-form label-width="80px" :model="editForm">


            <el-upload
                    style="border:1px solid #bcbec2; width: 100px;height: 100px;margin-left: 94px;margin-bottom: 20px;"
                    class="avatar-uploader"
                    action="/upload/up"
                    :show-file-list="false"
                    :on-success="handleAvatarSuccess"
                    :before-upload="beforeAvatarUpload">
                <img v-if="imageUrl" :src="imageUrl" class="avatar" width="100px" height="100px">
                <i v-else class="el-icon-plus avatar-uploader-icon" style="margin-left: 38px;margin-top: 41px;"></i>
            </el-upload>


            <el-form-item label="账号" prop="username">
                <el-input v-model="editForm.username"></el-input>
            </el-form-item>


            <el-form-item label="真实姓名" prop="realname">
                <el-input v-model="editForm.realname"></el-input>
            </el-form-item>

            <el-form-item label="年龄" prop="age">
                <el-input v-model="editForm.age"></el-input>
            </el-form-item>


            <el-form-item label="性别" prop="sex" :data="SexAll">
                <el-select v-model="editForm.sex" placeholder="请选择性别" style="width: 100%">
                    <el-option
                            v-for="item in SexAll"
                            :key="item.id"
                            :label="item.name"
                            :value="item.sex">
                    </el-option>
                </el-select>

            </el-form-item>


            <el-form-item label="密码" prop="password">
                <el-input v-model="editForm.password"></el-input>
            </el-form-item>


        </el-form>

        <span slot="footer" class="dialog-footer">
                        <el-button @click="dialogVisible = false">取 消</el-button>
                        <el-button type="primary" @click="confirmUpdate">确认修改</el-button>
        </span>
    </el-dialog>








    <!--修改的弹出层dialogVisible:控制对话框的显示和隐藏-->
    <el-dialog
            title="修改提示"
            :visible.sync="dialogVisible1"
            width="30%"
    >
        <!--:model:绑定表单数据-->
        <el-form label-width="80px" :model="editForm1">


            <el-upload
                    style="border:1px solid #bcbec2; width: 100px;height: 100px;margin-left: 94px;margin-bottom: 20px;"
                    class="avatar-uploader"
                    action="/upload/up"
                    :show-file-list="false"
                    :on-success="handleAvatarSuccess"
                    :before-upload="beforeAvatarUpload">
                <img v-if="imageUrl1" :src="imageUrl1" class="avatar" width="100px" height="100px">
                <i v-else class="el-icon-plus avatar-uploader-icon" style="margin-left: 38px;margin-top: 41px;"></i>
            </el-upload>


            <el-form-item label="账号/名字" prop="dName">
                <el-input v-model="editForm1.dName"></el-input>
            </el-form-item>

            <el-form-item label="年龄" prop="dAge">
                <el-input v-model="editForm1.dAge"></el-input>
            </el-form-item>


            <el-form-item label="手机号" prop="dTelphone">
                <el-input v-model="editForm1.dTelphone"></el-input>
            </el-form-item>


            <el-form-item label="性别" prop="sex" :data="SexAll">
                <el-select v-model="editForm1.sex" placeholder="请选择性别" style="width: 100%">
                    <el-option
                            v-for="item in SexAll"
                            :key="item.id"
                            :label="item.name"
                            :value="item.sex">
                    </el-option>
                </el-select>
            </el-form-item>


            <el-form-item label="科室号" prop="dTid" :data="keshiAll">
                <el-select v-model="editForm1.dTid" placeholder="科室科室号" style="width: 100%">
                    <el-option
                            v-for="item in keshiAll"
                            :key="item.tId"
                            :label="item.tName"
                            :value="item.tId">
                    </el-option>
                </el-select>
            </el-form-item>


            <el-form-item label="密码" prop="dPassword">
                <el-input v-model="editForm1.dPassword"></el-input>
            </el-form-item>

            <el-form-item label="身份证号" prop="dIdcard">
                <el-input v-model="editForm1.dIdcard"></el-input>
            </el-form-item>


            <el-form-item label="教育背景" prop="dEducation">
                <el-select v-model="editForm1.dEducation" placeholder="请选择性别" style="width: 100%">
                    <el-option>博士研究生</el-option>
                    <el-option>研究生</el-option>
                    <el-option>本科</el-option>
                </el-select>
            </el-form-item>


            <el-form-item label="主治" prop="dMajor">
                <el-input v-model="editForm1.dMajor"></el-input>
            </el-form-item>

            <el-form-item label="主治描述" prop="dMajorDesc">
                <el-input v-model="editForm1.dMajorDesc"></el-input>
            </el-form-item>

            <el-form-item label="主要成就" prop="dAchievement">
                <el-input v-model="editForm1.dAchievement"></el-input>
            </el-form-item>


        </el-form>

        <span slot="footer" class="dialog-footer">
                        <el-button @click="dialogVisible1 = false">取 消</el-button>
                        <el-button type="primary" @click="confirmUpdate1">确认修改</el-button>
        </span>
    </el-dialog>
















</div>
</body>
<script>
    let a=new Vue({
        el:"#app",
        data:{

            keshiAll:[],
            size: '',
            //用户对象
            userVo:{},
            //医生对象
            doctorVo:{},
            //管理员对象
            adminVo:{},
            realname:'',
            dialogVisible:false,
            dialogVisible1:false,
            dialogVisible2:false,
            //用户头像
            userheadurl:'',
            doctorheadurl:'',
            adminheadurl:'',

            editForm:{},
            editForm1:{},
            editForm2:{},

            imageUrl: "",
            imageUrl1: "",
            imageUrl2: "",

            format1:{},

            flag:false,
            flag1:false,
            flag2:false,

            dId:'',
        },
        created(){
            this.getuser();
            this.intosex();
            this.initkeshi();
        },

        methods:{

            //导出excel
            daochu(){
              console.log(this.adminVo)
                this.format1.id=this.adminVo.aId
                this.format1.name=this.adminVo.aName
                this.format1.password=this.adminVo.aPassword
                this.format1.hearurl=this.adminVo.aHearurl


                axios.post("/excel/download",this.format1,{responseType: 'blob'}).then(function (response){
                    let blob = new Blob([response.data])
                    console.log(blob)
                    let downloadElement = document.createElement('a');
                    let href = window.URL.createObjectURL(blob); //创建下载的链接
                    downloadElement.href = href;
                    downloadElement.download = '管理员.xlsx'; //下载后文件名
                    document.body.appendChild(downloadElement);
                    downloadElement.click(); //点击下载a
                    document.body.removeChild(downloadElement); //下载完成移除元素
                    window.URL.revokeObjectURL(href); //释放掉blob对象

                })

            },


            confirmUpdate(){

                //提交到后台应该是修改之后的头像的url地址，需要重新赋值一下
                this.editForm.headurl = this.imageUrl;
                axios.post("/user/update", this.editForm).then(result => {
                    if (result.data.code === 200) {
                        this.$message.success("修改员工信息成功")
                        //关闭弹出层
                        this.dialogVisible = false;

                        //重新加在描述数据
                        this.getone();
                    }
                })
            },


            confirmUpdate2(){

                //提交到后台应该是修改之后的头像的url地址，需要重新赋值一下
                this.editForm2.aHearurl = this.imageUrl2;
                axios.post("/admin/update", this.editForm2).then(result => {
                    if (result.data.code === 200) {
                        this.$message.success("修改员工信息成功")
                        //关闭弹出层
                        this.dialogVisible2 = false;

                        //重新加在描述数据
                        this.getadminone()
                    }
                })
            },

            confirmUpdate1(){

                //提交到后台应该是修改之后的头像的url地址，需要重新赋值一下
                this.editForm1.dHeadurl = this.imageUrl1;
                axios.post("/doctor/update", this.editForm1).then(result => {
                    if (result.data.code === 200) {
                        this.$message.success("修改员工信息成功")
                        //关闭弹出层
                        this.dialogVisible1 = false;

                        //重新加在描述数据
                        this.getdoctormessage();
                    }
                })
            },

            update(){
               this.dialogVisible=true
                //回显图片
                this.imageUrl = this.userVo.headurl
                //在此转json是为了把数据固定阻断双向绑定里面的数据同步
                let parse = JSON.parse(JSON.stringify(this.userVo));
                this.editForm = parse;

            },
            update2(){
               this.dialogVisible2=true
                //回显图片
                this.imageUrl2 = this.adminVo.aHearurl
                //在此转json是为了把数据固定阻断双向绑定里面的数据同步
                let parse = JSON.parse(JSON.stringify(this.adminVo));
                this.editForm2 = parse;

            },
            update1(){
               this.dialogVisible1=true;
                //回显图片
                this.imageUrl1 = this.doctorVo.dHeadurl
                //在此转json是为了把数据固定阻断双向绑定里面的数据同步
                let parse = JSON.parse(JSON.stringify(this.doctorVo));
                this.editForm1 = parse;

            },



            getone(){
               axios.get("/user/findOne?uId="+this.userVo.uId).then(resp=>{
                   this.userVo=resp.data.data
               })
            },




            getdoctorone(){
                axios.get("/doctor/findOne?dId="+this.doctorVo.dId).then(resp=>{
                    this.doctorVo=resp.data.data
                })
            },

            getadminone(){
                axios.get("/admin/findOne?aId="+this.adminVo.aId).then(resp=>{
                    this.adminVo=resp.data.data
                })
            },





            //初始化科室
            initkeshi(){
                axios.post("/TechnicalOffice/select?currentPage=1"  + "&pageSize=50",this.officeVo).then(resp => {
                    console.log(resp)

                    this.keshiAll = resp.data.data.list;

                })
            },


            //得到当前已经登录的用户的职业（权限）名字
            getuser() {
                axios.post("/login/getuser").then(result => {

                    if (result.data.code === 5025) {
                        if(result.data.data.uId !=null){
                            this.userVo = result.data.data;
                            this.userheadurl=result.data.data.headurl;
                            this.flag=true;
                        }
                        if(result.data.data.dId !=null){
                            this.doctorVo = result.data.data;
                            this.dId=result.data.data.dId
                           this.getdoctormessage();
                            this.addForm1=result.data.data
                            this.flag1=true;
                        }
                        if(result.data.data.aId !=null){
                            this.realname = "超级管理员";
                            this.adminVo=result.data.data;
                            this.adminheadurl=result.data.data.aHearurl;
                            this.flag2=true;
                        }

                    }
                })
            },

            getdoctormessage(){
                axios.get("/doctor/findMany?dId="+this.dId).then(resp => {
                    console.log(resp.data)
                    let a=new Array();
                   a= resp.data.data
                    this.doctorVo = a[0]
                    this.doctorheadurl= this.doctorVo.dHeadurl

                });
            },


            //性别
            intosex() {
                axios.get("/sex/all").then(resp => {

                    if (resp.data.code === 200) {
                        this.SexAll = resp.data.data
                    }
                })
            },
            //上传头像成功后的处理
            handleAvatarSuccess(res, file) {
                this.imageUrl = res.data;
                this.imageUrl1 = res.data;
                this.imageUrl2 = res.data;
            },
            //在上传之前执行的函数，用来回显头像数据
            beforeAvatarUpload(file) {
                const isJPG = file.type === 'image/jpeg';
                const isLt2M = file.size / 1024 / 1024 < 10;

                if (!isJPG) {
                    this.$message.error('上传头像图片只能是 JPG 格式!');
                }
                if (!isLt2M) {
                    this.$message.error('上传头像图片大小不能超过 2MB!');
                }
                return isJPG && isLt2M;
            },




        }

    })
</script>
</html>
